<script setup>
import {ref, reactive, computed, onMounted} from 'vue';
import {MessagePlugin} from 'tdesign-vue-next';
import {applyForActivity} from "@/api/activity.js";
import {useUserStore} from "@/stores/user.js";
import {listActivityAdministrator, pageAllFeedback} from "@/api/administrator.js";
import {useAdministratorStore} from "@/stores/administrator.js";
import {listPageActivityMessage} from "@/api/activityMessage.js";
import {readOffset} from "@/api/notice.js";
import {useActivityMessage} from "@/stores/activityMessage.js";

const userStore = useUserStore()
const activityMessage = useActivityMessage();

const feedbackVisible = ref(false)
const feedbackList = ref([])
// 默认为1，current用来做锚点
const feedbackCurrent = ref(1)
const feedbackTotal = ref(0)
const feedbackPageSize = ref(6) // 单次加载数量

const asyncLoadingRadioFeedback = ref('load-more');
const tempList = ref([])

const loadMoreFeedback = async () => {
  asyncLoadingRadioFeedback.value = 'loading';
  const res = await listPageActivityMessage(userStore, ++feedbackCurrent.value, feedbackPageSize.value);
  tempList.value = res.data.data.records
  if (tempList.value.length !== 0) {
    const offsetStr = tempList.value.map((item)=>{return item.activityId}).join(",")
    const res2 = await readOffset(userStore, offsetStr);
    activityMessage.unreadCount = res2.data.data
  }
  feedbackTotal.value = res.data.data.total
  feedbackList.value.push(...res.data.data.records)
  if (feedbackList.value.length === feedbackTotal.value) {
    asyncLoadingRadioFeedback.value = 'loading-custom'
  } else {
    asyncLoadingRadioFeedback.value = 'load-more';
  }
};

const asyncLoadingFeedback = computed(() => {
  if (asyncLoadingRadioFeedback.value === 'loading-custom') {
    return '没有更多数据了';
  }
  return asyncLoadingRadioFeedback.value;
});


// 初始化数据 ---------------------------------------------
onMounted(async () => {
  const res = await listPageActivityMessage(userStore, feedbackCurrent.value, feedbackPageSize.value);
  feedbackTotal.value = res.data.data.total
  feedbackList.value = res.data.data.records
  if (feedbackList.value.length !== 0) {
    const offsetStr = feedbackList.value.map((item)=>{return item.activityId}).join(",")
    const res2 = await readOffset(userStore, offsetStr);
    activityMessage.unreadCount = res2.data.data
  }


})
</script>

<template>
  <t-layout style="
      height: 100%;                /* 继承父容器高度 */
    ">
    <t-content
        style="background-color: white; width: 100%; display: flex; align-items: center; justify-content: center">
      <t-list style="height: 400px; width: 80%" :async-loading="asyncLoadingFeedback" split @load-more="loadMoreFeedback" >
        <t-list-item v-for="(item, index) in feedbackList" :key="index">
          <t-typography-paragraph :ellipsis="ellipsisState">{{item.message}}</t-typography-paragraph>
        </t-list-item>
      </t-list>
    </t-content>

  </t-layout>

</template>

<style scoped>

</style>